{%  extends 'base.html' %}
{% block title %}
    首页
{% endblock %}
{% block content %}
    <div style="width: 300px;float: right">
        <form action="" method="get">
            <div class="input-group">

             <input type="text" class="form-control" placeholder="搜索..." name="q" value="{{ value }}">


             <span class="input-group-btn">
                 <button class="btn btn-default" type="submit"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></button>
             </span>


            </div><!-- /input-group -->
        </form>
    </div>
<table class="table  table-striped">
<thead>
<tr>
<th scope="col">id</th>
<th scope="col">账号</th>
<th scope="col">手机号</th>
<th scope="col">价格</th>
<th scope="col">等级</th>
</tr>

</thead>
<tbody>
{% for data in datas %}
<tr>

        <th scope="row">{{ data.id }}</th>
        <td>{{ data.name }}</td>
        <td>{{ data.mobile }}</td>
        <td>{{ data.price}}</td>
        <td>{{ data.level }}</td>


</tr>
{% endfor %}
</tbody>

<tbody>
{% if queryset %}
    {% for item in queryset %}
<tr>

        <th scope="row">{{ item.id }}</th>
        <td>{{ item.name }}</td>
        <td>{{ item.mobile }}</td>
        <td>{{ item.price}}</td>
        <td>{{ item.level }}</td>


</tr>
    {% endfor %}

{% endif %}

</tbody>
</table>

    <div class="col-lg-offset-5">
<nav aria-label="Page navigation">
  <ul class="pagination">
    <li>
      <a href="#" aria-label="Previous">
        <span aria-hidden="true">&laquo;</span>
      </a>
    </li>
    <li><a href="#">1</a></li>
    <li><a href="#">2</a></li>
    <li><a href="#">3</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">5</a></li>
    <li>
      <a href="#" aria-label="Next">
        <span aria-hidden="true">&raquo;</span>
      </a>
    </li>
  </ul>
</nav>
</div>
{% endblock %}